
<template>
  <el-card>
   <template #header>
    <h2>hr注册</h2>
  </template>
    <el-divier></el-divier>
    <el-form :model="hrForm" status-icon :rules="rules" ref="hrForm" label-width="150px" class="demo-hrForm">
  <el-form-item label="用户名" prop="hrName">
    <el-input  v-model="hrForm.hrName" autocomplete="off" style="width: 45%;"></el-input>
  </el-form-item>
  <el-form-item label="密码" prop="psw">
    <el-input type="password" v-model="hrForm.psw" autocomplete="off" style="width: 45%;"></el-input>
  </el-form-item>
  <el-form-item label="确认密码" prop="checkPsw">
    <el-input type="password" v-model="hrForm.checkPsw" autocomplete="off" style="width: 45%;"></el-input>
  </el-form-item>
  <el-form-item label="companyID" prop="companyId">
    <el-input v-model.number="hrForm.companyId" style="width: 45%;"></el-input >
  </el-form-item>
  <el-form-item>
    <el-button type="primary" @click="hrSignUpSubmit('hrForm')">提交</el-button>
    <el-button @click="resetFormAndToLogin">返回登录界面</el-button>
  </el-form-item>
  <el-form-item>
    <el-link :underline="false" type="primary" @click="toEmSignUp">员工用户注册</el-link>
  </el-form-item>
</el-form>
  </el-card>

</template>
<script>
  export default {
    name:'hrSignUp',
    data() {
      var checkHrName = (rule, value, callback) => {
        if (!value) {
          return callback(new Error('用户名'));
        }else{callback();}
        // setTimeout(() => {
        //   if (!Number.isInteger(value)) {
        //     callback(new Error('汉字'));
        //   } else {
        //       callback();
        //   }
        // }, 1000);
      };
      var checkCompanyId = (rule, value, callback) => {
        if (!value) {
          return callback(new Error('公司id不能为空'));
        }
        setTimeout(() => {
          if (!Number.isInteger(value)) {
            callback(new Error('请输入数字值'));
          } else {
            
              callback();
            
          }
        }, 1000);
      };
      var validatePass = (rule, value, callback) => {
        if (value === '') {
          callback(new Error('请输入密码'));
        } else {
          if (this.hrForm.checkPsw !== '') {
            this.$refs.hrForm.validateField('checkPsw');
          }
          callback();
        }
      };
      var validatePass2 = (rule, value, callback) => {
        if (value === '') {
          callback(new Error('请再次输入密码'));
        } else if (value !== this.hrForm.psw) {
          callback(new Error('两次输入密码不一致!'));
        } else {
          callback();
        }
      };
      return {
        hrForm: {
          hrName:'',
          psw: '',
          checkPsw: '',
          companyId: ''
        },
        rules: {
          hrName:[
            {validator: checkHrName,trigger:'blur' }
          ],
          psw: [
            { validator: validatePass, trigger: 'blur' }
          ],
          checkPsw: [
            { validator: validatePass2, trigger: 'blur' }
          ],
          companyId: [
            { validator: checkCompanyId, trigger: 'blur' }
          ]
        }
      };
    },
    methods: {
      hrSignUpSubmit(formName) {//hr注册功能函数
        this.$refs[formName].validate((valid) => {
          if (valid) {
            
            this.$axios.get("#")
            .then(function(response){
              console.log(response.data)
              alert('注册成功');
            },function(err){
              alert('注册成功失败')
            })
          } else {
            console.log('error submit!!');
            return false;
          }
        });
      },
      resetFormAndToLogin() {
        //this.$refs[formName].resetFields();
        this.$router.push({path:'/Login'});
      },
      toEmSignUp(){
        this.$router.push({path:'/emSignUp'});
      }
    }
  }
</script>

<style>

</style>
